<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Document</title>
  <link href="../output.css" rel="stylesheet" />
</head>

<body>
  <div class="text-sm text-gray-900">
    <nav class="flex item-center px-4 py-3 bg-gray-900 justify-between">
      <div class="text-white space-x-4 flex items-center">
        <a class="w-6 fill-current hover:text-gray-300" href="#">
          <svg aria-hidden="true" viewBox="0 0 24 24" version="1.1" data-view-component="true" class="w-6">
            <path
              d="M12.5.75C6.146.75 1 5.896 1 12.25c0 5.089 3.292 9.387 7.863 10.91.575.101.79-.244.79-.546 0-.273-.014-1.178-.014-2.142-2.889.532-3.636-.704-3.866-1.35-.13-.331-.69-1.352-1.18-1.625-.402-.216-.977-.748-.014-.762.906-.014 1.553.834 1.769 1.179 1.035 1.74 2.688 1.25 3.349.948.1-.747.402-1.25.733-1.538-2.559-.287-5.232-1.279-5.232-5.678 0-1.25.445-2.285 1.178-3.09-.115-.288-.517-1.467.115-3.048 0 0 .963-.302 3.163 1.179.92-.259 1.897-.388 2.875-.388.977 0 1.955.13 2.875.388 2.2-1.495 3.162-1.179 3.162-1.179.633 1.581.23 2.76.115 3.048.733.805 1.179 1.825 1.179 3.09 0 4.413-2.688 5.39-5.247 5.678.417.36.776 1.05.776 2.128 0 1.538-.014 2.774-.014 3.162 0 .302.216.662.79.547C20.709 21.637 24 17.324 24 12.25 24 5.896 18.854.75 12.5.75Z" />
          </svg>
        </a>
        <div class="relative">
          <input type="text" placeholder="Search or jump to..."
            class="rounded bg-gray-900 border border-gray-600 placeholder-gray-400 w-72 pr-10 pl-3 py-1" />
          <div class="absolute right-0 top-0 flex items-center h-full">
            <div class="border border-gray-600 rounded text-sm text-gray-400 px-2 mx-2">
              /
            </div>
          </div>
        </div>
        <ul class="flex items-center font-semibold space-x-4 text-gray-300">
          <li class="hover:text-gray-500"><a href="#">Pull requests</a></li>
          <li class="hover:text-gray-500"><a href="#">Issues</a></li>
          <li class="hover:text-gray-500"><a href="#">Marketplace</a></li>
          <li class="hover:text-gray-500"><a href="#">Explore</a></li>
        </ul>
      </div>
      <div class="text-white flex items-center space-x-4">
        <a href="#" class="relative hover:text-gray-400 flex items-center ">
          <svg class="w-5 fill-current" data-view-component="true" aria-hidden="true" viewBox="0 0 1024 1024"
            version="1.1">
            <path
              d="M512 212l48.8 12c101.6 24.8 176 117.6 176 220.8v254.4l18.4 18.4 24.8 25.6h-536l24.8-25.6 18.4-18.4V444.8c0-103.2 73.6-196.8 176-220.8l48.8-12M512 64c-36.8 0-64 30.4-64 68v30.4C320.8 192 223.2 307.2 223.2 444.8v228.8L136 763.2v44.8h752v-44.8l-87.2-89.6V444.8c0-137.6-97.6-252.8-224.8-283.2v-28.8c0-32-17.6-60.8-48-67.2-5.6-1.6-11.2-1.6-16-1.6z m88 808H424c0 49.6 38.4 88 88 88s88-38.4 88-88z">
            </path>
          </svg>
          <div class="bg-blue-400 rounded-full w-2 h-2 absolute top-0 right-0"></div>
        </a>
        <a href="#" class="flex items-center hover:text-gray-400 ">
          <div class="flex items-center border border-gray-600 p-1 rounded-md">
            <svg class="w-4 h-4 fill-current" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
              <path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" />
            </svg>
            <svg viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-2 h-2">
              <path stroke-linecap="round" stroke-linejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5" />
            </svg>
          </div>
        </a>
        <a class="flex items-center hover:text-gray-400" href="#">
          <img class="rounded-full w-6 h-6"
            src="https://mp-f60d8913-df0a-42c2-9ef3-3ebcaabd1ae1.cdn.bspapp.com/pic/1 (12).jpg" alt="">
        </a>
      </div>
    </nav>

    <div class="repo-stats bg-gray-100 flex items-center justify-between px-8 py-4">
      <div class="flex  text-gray">
        <svg class="w-5 fill-none " aria-hidden="true" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
          <path stroke-linecap="round" stroke-linejoin="round"
            d="M2.25 13.5h3.86a2.25 2.25 0 0 1 2.012 1.244l.256.512a2.25 2.25 0 0 0 2.013 1.244h3.218a2.25 2.25 0 0 0 2.013-1.244l.256-.512a2.25 2.25 0 0 1 2.013-1.244h3.859m-19.5.338V18a2.25 2.25 0 0 0 2.25 2.25h15A2.25 2.25 0 0 0 21.75 18v-4.162c0-.224-.034-.447-.1-.661L19.24 5.338a2.25 2.25 0 0 0-2.15-1.588H6.911a2.25 2.25 0 0 0-2.15 1.588L2.35 13.177a2.25 2.25 0 0 0-.1.661Z" />
        </svg>
        <div class="flex items-center text-xl ml-2">
          <a href="#" class="text-blue-600 hover:underline">tailwindlab</a>
          <span class="mx-1">/</span>
          <a href="#" class="text-blue-600 hover:underline font-semibold">tailwind
          </a>
          <div class=" px-2 ml-2  text-xs   bg-gray-100 rounded-xl border border-gray-300 text-gray-600 ">Public</div>
        </div>
      </div>
      <div class="flex space-x-2 ">
        <div class=" flex text-xs shadow-sm ">
          <button class=" border border-gray-300 rounded-lg rounded-r-none px-2 py-2 flex items-center  space-x-1">
            <svg class="w-4 " focusable="false" viewBox="0 0 16 16" fill="currentColor">
              <path
                d="M8 2c1.981 0 3.671.992 4.933 2.078 1.27 1.091 2.187 2.345 2.637 3.023a1.62 1.62 0 0 1 0 1.798c-.45.678-1.367 1.932-2.637 3.023C11.67 13.008 9.981 14 8 14c-1.981 0-3.671-.992-4.933-2.078C1.797 10.83.88 9.576.43 8.898a1.62 1.62 0 0 1 0-1.798c.45-.677 1.367-1.931 2.637-3.022C4.33 2.992 6.019 2 8 2ZM1.679 7.932a.12.12 0 0 0 0 .136c.411.622 1.241 1.75 2.366 2.717C5.176 11.758 6.527 12.5 8 12.5c1.473 0 2.825-.742 3.955-1.715 1.124-.967 1.954-2.096 2.366-2.717a.12.12 0 0 0 0-.136c-.412-.621-1.242-1.75-2.366-2.717C10.824 4.242 9.473 3.5 8 3.5c-1.473 0-2.825.742-3.955 1.715-1.124.967-1.954 2.096-2.366 2.717ZM8 10a2 2 0 1 1-.001-3.999A2 2 0 0 1 8 10Z">
              </path>
            </svg>
            <span class="font-semibold">Watch</span>
            <svg aria-hidden="true" focusable="false" role="img" class="octicon octicon-triangle-down"
              viewBox="0 0 16 16" width="16" height="16" fill="currentColor"
              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;">
              <path
                d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z">
              </path>
            </svg>
          </button>
          <a href="#"
            class="flex items-center border border-gray-300 rounded-lg rounded-l-none px-3 py-1 border-l-0 font-semibold hover:text-blue-400 bg-white">520</a>
        </div>

        <div class=" flex text-xs shadow-sm ">
          <button class="border border-gray-300 rounded-lg rounded-r-none px-2 py-2 flex items-center  space-x-1">
            <svg x fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-4">
              <path stroke-linecap="round" stroke-linejoin="round"
                d="M11.48 3.499a.562.562 0 0 1 1.04 0l2.125 5.111a.563.563 0 0 0 .475.345l5.518.442c.499.04.701.663.321.988l-4.204 3.602a.563.563 0 0 0-.182.557l1.285 5.385a.562.562 0 0 1-.84.61l-4.725-2.885a.562.562 0 0 0-.586 0L6.982 20.54a.562.562 0 0 1-.84-.61l1.285-5.386a.562.562 0 0 0-.182-.557l-4.204-3.602a.562.562 0 0 1 .321-.988l5.518-.442a.563.563 0 0 0 .475-.345L11.48 3.5Z" />
            </svg>
            <span class="font-semibold">Star</span>
            <svg aria-hidden="true" focusable="false" role="img" class="octicon octicon-triangle-down"
              viewBox="0 0 16 16" width="16" height="16" fill="currentColor"
              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;">
              <path
                d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z">
              </path>
            </svg>
          </button>
          <a href="#"
            class=" flex items-center border border-gray-300 rounded-lg rounded-l-none px-3 py-1 border-l-0 font-semibold hover:text-blue-400 bg-white">520</a>
        </div>

        <div class=" flex text-xs shadow-sm ">
          <button class=" border border-gray-300 rounded-lg rounded-r-none px-2 py-1 flex items-center  space-x-1">
            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
              stroke="currentColor" class="w-4">
              <path stroke-linecap="round" stroke-linejoin="round"
                d="M7.217 10.907a2.25 2.25 0 1 0 0 2.186m0-2.186c.18.324.283.696.283 1.093s-.103.77-.283 1.093m0-2.186 9.566-5.314m-9.566 7.5 9.566 5.314m0 0a2.25 2.25 0 1 0 3.935 2.186 2.25 2.25 0 0 0-3.935-2.186Zm0-12.814a2.25 2.25 0 1 0 3.933-2.185 2.25 2.25 0 0 0-3.933 2.185Z" />
            </svg>

            <span class="font-semibold">Fork</span>
            <svg aria-hidden="true" focusable="false" role="img" class="octicon octicon-triangle-down"
              viewBox="0 0 16 16" width="16" height="16" fill="currentColor"
              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;">
              <path
                d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z">
              </path>
            </svg>
          </button>
          <a href="#"
            class="space-y-1 flex items-center border border-gray-300 rounded-lg rounded-l-none px-3 py-1 border-l-0 font-semibold hover:text-blue-400 bg-white">520</a>
        </div>
      </div>
    </div><!-- end repo stats -->

    <ul class="repo-nav bg-gray-100 border-b border-gray-300 flex items-center px-8 pt-1 ">
      <li class="font-semibold">
        <a href="#" class="flex items-center border-b-4 border-blue-500 px-4 pb-3 ">
          <svg class="w-4 fill-current " viewBox="0 0 16 16" version="1.1" data-view-component="true">
            <path
              d="m11.28 3.22 4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734L13.94 8l-3.72-3.72a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215Zm-6.56 0a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042L2.06 8l3.72 3.72a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215L.47 8.53a.75.75 0 0 1 0-1.06Z">
            </path>
          </svg>
          <span class="ml-2">Code</span>
        </a>
      </li>
      <li class="  ">
        <a href="#" class="flex items-center  px-4 pb-3 text-gray-700    hover:text-black ">
          <svg class="w-4 fill-current" aria-hidden="true" viewBox="0 0 16 16" version="1.1" data-view-component="true">
            <path d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"></path>
            <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"></path>
          </svg>
          <span class="ml-2">Issues</span>
          <div class="flex items-center bg-gray-200 rounded-lg px-1 ml-2">521</div>
        </a>
      </li>
      <li>
        <a href="#" class="flex items-center  px-4 pb-3 text-gray-700   hover:text-black ">
          <svg class="w-4 fill-current" aria-hidden="true" viewBox="0 0 16 16" version="1.1" data-view-component="true"
            class="octicon octicon-git-pull-request UnderlineNav-octicon d-none d-sm-inline">
            <path
              d="M1.5 3.25a2.25 2.25 0 1 1 3 2.122v5.256a2.251 2.251 0 1 1-1.5 0V5.372A2.25 2.25 0 0 1 1.5 3.25Zm5.677-.177L9.573.677A.25.25 0 0 1 10 .854V2.5h1A2.5 2.5 0 0 1 13.5 5v5.628a2.251 2.251 0 1 1-1.5 0V5a1 1 0 0 0-1-1h-1v1.646a.25.25 0 0 1-.427.177L7.177 3.427a.25.25 0 0 1 0-.354ZM3.75 2.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm0 9.5a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Zm8.25.75a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Z">
            </path>
          </svg>
          <span class="ml-2">Pull requests</span>
        </a>
      </li>
      <li>
        <a href="#" class="flex items-center px-4 pb-3 text-gray-700   hover:text-black ">
          <svg fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-6">
            <path stroke-linecap="round" stroke-linejoin="round"
              d="M8.625 9.75a.375.375 0 1 1-.75 0 .375.375 0 0 1 .75 0Zm0 0H8.25m4.125 0a.375.375 0 1 1-.75 0 .375.375 0 0 1 .75 0Zm0 0H12m4.125 0a.375.375 0 1 1-.75 0 .375.375 0 0 1 .75 0Zm0 0h-.375m-13.5 3.01c0 1.6 1.123 2.994 2.707 3.227 1.087.16 2.185.283 3.293.369V21l4.184-4.183a1.14 1.14 0 0 1 .778-.332 48.294 48.294 0 0 0 5.83-.498c1.585-.233 2.708-1.626 2.708-3.228V6.741c0-1.602-1.123-2.995-2.707-3.228A48.394 48.394 0 0 0 12 3c-2.392 0-4.744.175-7.043.513C3.373 3.746 2.25 5.14 2.25 6.741v6.018Z" />
          </svg>


          <span class="ml-2">Discussions</span>
        </a>
      </li>
      <li>
        <a href="#" class="flex items-center  px-4 pb-3 text-gray-700   hover:text-black ">
          <svg aria-hidden="true" viewBox="0 0 16 16" version="1.1" data-view-component="true" class="w-4 fill-current">
            <path
              d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Zm4.879-2.773 4.264 2.559a.25.25 0 0 1 0 .428l-4.264 2.559A.25.25 0 0 1 6 10.559V5.442a.25.25 0 0 1 .379-.215Z">
            </path>
          </svg>
          <span class="ml-2">Actions</span>
        </a>
      </li>
      <li>
        <a href="#" class="flex items-center  px-4 pb-3 text-gray-700   hover:text-black ">
          <svg aria-hidden="true" viewBox="0 0 16 16" version="1.1" data-view-component="true" class="w-4 fill-current">
            <path
              d="M7.467.133a1.748 1.748 0 0 1 1.066 0l5.25 1.68A1.75 1.75 0 0 1 15 3.48V7c0 1.566-.32 3.182-1.303 4.682-.983 1.498-2.585 2.813-5.032 3.855a1.697 1.697 0 0 1-1.33 0c-2.447-1.042-4.049-2.357-5.032-3.855C1.32 10.182 1 8.566 1 7V3.48a1.75 1.75 0 0 1 1.217-1.667Zm.61 1.429a.25.25 0 0 0-.153 0l-5.25 1.68a.25.25 0 0 0-.174.238V7c0 1.358.275 2.666 1.057 3.86.784 1.194 2.121 2.34 4.366 3.297a.196.196 0 0 0 .154 0c2.245-.956 3.582-2.104 4.366-3.298C13.225 9.666 13.5 8.36 13.5 7V3.48a.251.251 0 0 0-.174-.237l-5.25-1.68ZM8.75 4.75v3a.75.75 0 0 1-1.5 0v-3a.75.75 0 0 1 1.5 0ZM9 10.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z">
            </path>
          </svg>
          <span class="ml-2">Security</span>
        </a>
      </li>
      <li>
        <a href="#" class="flex items-center  px-4 pb-3 text-gray-700  hover:text-black  ">
          <svg aria-hidden="true" viewBox="0 0 16 16" version="1.1" data-view-component="true"
            class="w-4  fill-current">
            <path
              d="M1.5 1.75V13.5h13.75a.75.75 0 0 1 0 1.5H.75a.75.75 0 0 1-.75-.75V1.75a.75.75 0 0 1 1.5 0Zm14.28 2.53-5.25 5.25a.75.75 0 0 1-1.06 0L7 7.06 4.28 9.78a.751.751 0 0 1-1.042-.018.751.751 0 0 1-.018-1.042l3.25-3.25a.75.75 0 0 1 1.06 0L10 7.94l4.72-4.72a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042Z">
            </path>
          </svg>
          <span class="ml-2">Insights</span>
        </a>
      </li>
    </ul><!-- end repo env -->
    <div class="container mx-auto my-8 px-4 flex ">
      <div class="file-explorer-container  w-3/4">
        <div class="branch-navigation flex items-center justify-between">
          <div class="flex items-center space-x-1">
            <button class="p-2  border rounded-md bg-gray-200">
              <svg aria-hidden="true" focusable="false" role="img" class="octicon octicon-git-branch"
                viewBox="0 0 16 16" width="16" height="16" fill="currentColor"
                style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;">
                <path
                  d="M9.5 3.25a2.25 2.25 0 1 1 3 2.122V6A2.5 2.5 0 0 1 10 8.5H6a1 1 0 0 0-1 1v1.128a2.251 2.251 0 1 1-1.5 0V5.372a2.25 2.25 0 1 1 1.5 0v1.836A2.493 2.493 0 0 1 6 7h4a1 1 0 0 0 1-1v-.628A2.25 2.25 0 0 1 9.5 3.25Zm-6 0a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Zm8.25-.75a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5ZM4.25 12a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Z">
                </path>
              </svg>
              <span>master</span>
              <svg aria-hidden="true" focusable="false" role="img" class="octicon octicon-triangle-down"
                viewBox="0 0 16 16" width="16" height="16" fill="currentColor"
                style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;">
                <path
                  d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z">
                </path>
              </svg></button>
            <button class=" py-2 px-1  border-0 rounded-md hover:bg-gray-200 ">
              <svg aria-hidden="true" focusable="false" role="img" class="octicon octicon-git-branch"
                viewBox="0 0 16 16" width="16" height="16" fill="currentColor"
                style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;">
                <path
                  d="M9.5 3.25a2.25 2.25 0 1 1 3 2.122V6A2.5 2.5 0 0 1 10 8.5H6a1 1 0 0 0-1 1v1.128a2.251 2.251 0 1 1-1.5 0V5.372a2.25 2.25 0 1 1 1.5 0v1.836A2.493 2.493 0 0 1 6 7h4a1 1 0 0 0 1-1v-.628A2.25 2.25 0 0 1 9.5 3.25Zm-6 0a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Zm8.25-.75a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5ZM4.25 12a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Z">
                </path>
              </svg>
              <span class="font-semibold">45</span>
              <span class="">branches</span>
            </button>
            <button class=" py-2 px-1  border-0 rounded-md hover:bg-gray-200 ">
              <svg aria-hidden="true" focusable="false" role="img" class="octicon octicon-tag" viewBox="0 0 16 16"
                width="16" height="16" fill="currentColor"
                style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;">
                <path
                  d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z">
                </path>
              </svg>
              <span class="font-semibold">521</span>
              <span>Tags</span></button>
          </div>
          <div class="flex items-center space-x-1">
            <button class="border rounded-md bg-gray-200 p-2  font-semibold">Go to file</button>
            <button class="border rounded-md bg-gray-200 p-2  font-semibold"><span>Add file</span>
              <svg aria-hidden="true" focusable="false" role="img" class="octicon octicon-triangle-down"
                viewBox="0 0 16 16" width="16" height="16" fill="currentColor"
                style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;">
                <path
                  d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z">
                </path>
              </svg>
            </button>
            <button class="border rounded-md bg-green-600 text-white font-semibold p-2"><span>Code</span>
              <svg aria-hidden="true" focusable="false" role="img" class="octicon octicon-triangle-down"
                viewBox="0 0 16 16" width="16" height="16" fill="currentColor"
                style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;">
                <path
                  d="m4.427 7.427 3.396 3.396a.25.25 0 0 0 .354 0l3.396-3.396A.25.25 0 0 0 11.396 7H4.604a.25.25 0 0 0-.177.427Z">
                </path>
              </svg>
            </button>
          </div>
        </div><!-- end branch navigation -->
        <div
          class="commits-container bg-gray-100 rounded-md rounded-b-none border border-gray-300 border-b-0 flex items-center justify-between px-4 py-4 mt-5">
          <div class="flex items-center space-x-2 ">
            <img data-component="Avatar" class="border rounded-lg" alt="author" size="20"
              src="https://github.githubassets.com/images/gravatars/gravatar-user-420.png?size=40"
              data-testid="github-avatar" aria-label="author" height="20" width="20" _mstalt="81744"
              _mstaria-label="81744">
            <span class="font-semibold">凌沈</span>
            <a class="text-gray-500" href="#">19点36分</a>
          </div>
          <div>
            <a class="text-gray-500 hover:underline hover:text-blue-500" href="#">2ff498</a>
            <span class="text-gray-500">· 2 weeks ago</span>
            <button class="ml-2  p-2 rounded-lg hover:bg-gray-200">
              <svg aria-hidden="true" focusable="false" role="img" class="octicon octicon-history" viewBox="0 0 16 16"
                width="16" height="16" fill="currentColor"
                style="display:inline-block;user-select:none;vertical-align:text-bottom;overflow:visible">
                <path
                  d="m.427 1.927 1.215 1.215a8.002 8.002 0 1 1-1.6 5.685.75.75 0 1 1 1.493-.154 6.5 6.5 0 1 0 1.18-4.458l1.358 1.358A.25.25 0 0 1 3.896 6H.25A.25.25 0 0 1 0 5.75V2.104a.25.25 0 0 1 .427-.177ZM7.75 4a.75.75 0 0 1 .75.75v2.992l2.028.812a.75.75 0 0 1-.557 1.392l-2.5-1A.751.751 0 0 1 7 8.25v-3.5A.75.75 0 0 1 7.75 4Z">
                </path>
              </svg>
              <span>8 Commits</span>
            </button>
          </div>
        </div><!-- end commits container -->
        <div class="file-explorer rounded-md rounded-t-none border border-gray-300  ">
          <div class="flex justify-between px-4 py-3 hover:bg-gray-100 border-b ">
            <div class="w-4/12 flex items-center space-x-2 ">
              <svg class="w-3 h-3 fill-current text-blue-400">
                <path
                  d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z">
                </path>
              </svg>
              <button class="hover:underline hover:text-blue-500">db</button>
            </div>
            <div class="w-6/12">
              <button class="text-gray-500 hover:underline  hover:text-blue-500">11点58分</button>
            </div>
            <div class="w-2/12 text-right pr-2" text-right>
              <span href="#" class="text-gray-500 hover:cursor">2 months ago</span>
            </div>
          </div>
          <div class="flex justify-between px-4 py-3 hover:bg-gray-100 border-b ">
            <div class="w-4/12 flex items-center space-x-2 ">
              <svg class="w-3 h-3 fill-current text-blue-400">
                <path
                  d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z">
                </path>
              </svg>
              <button class="hover:underline hover:text-blue-500">db</button>
            </div>
            <div class="w-6/12">
              <button class="text-gray-500 hover:underline  hover:text-blue-500">11点58分</button>
            </div>
            <div class="w-2/12 text-right pr-2" text-right>
              <span href="#" class="text-gray-500 hover:cursor">2 months ago</span>
            </div>
          </div>
          <div class="flex justify-between px-4 py-3 hover:bg-gray-100 border-b ">
            <div class="w-4/12 flex items-center space-x-2 ">
              <svg class="w-3 h-3 fill-current text-blue-400">
                <path
                  d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z">
                </path>
              </svg>
              <button class="hover:underline hover:text-blue-500">db</button>
            </div>
            <div class="w-6/12">
              <button class="text-gray-500 hover:underline  hover:text-blue-500">11点58分</button>
            </div>
            <div class="w-2/12 text-right pr-2" text-right>
              <span href="#" class="text-gray-500 hover:cursor">2 months ago</span>
            </div>
          </div>
          <div class="flex justify-between px-4 py-3 hover:bg-gray-100 border-b ">
            <div class="w-4/12 flex items-center space-x-2 ">
              <svg class="w-3 h-3 fill-current text-blue-400">
                <path
                  d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z">
                </path>
              </svg>
              <button class="hover:underline hover:text-blue-500">db</button>
            </div><div class="w-6/12">
              <button class="text-gray-500 hover:underline  hover:text-blue-500">11点58分</button>
            </div>
            <div class="w-2/12 text-right pr-2" text-right>
              <span href="#" class="text-gray-500 hover:cursor">2 months ago</span>
            </div>
          </div>
          <div class="flex justify-between px-4 py-3 hover:bg-gray-100 border-b ">
            <div class="w-4/12 flex items-center space-x-2 ">
              <svg class="w-3 h-3 fill-current text-blue-400">
                <path
                  d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z">
                </path>
              </svg>
              <button class="hover:underline hover:text-blue-500">db</button>
            </div><div class="w-6/12">
              <button class="text-gray-500 hover:underline  hover:text-blue-500">11点58分</button>
            </div>
            <div class="w-2/12 text-right pr-2" text-right>
              <span href="#" class="text-gray-500 hover:cursor">2 months ago</span>
            </div>
          </div>
          <div class="flex justify-between px-4 py-3 hover:bg-gray-100 border-b ">
            <div class="w-4/12 flex items-center space-x-2 ">
              <svg class="w-3 h-3 fill-current text-blue-400">
                <path
                  d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z">
                </path>
              </svg>
              <button class="hover:underline hover:text-blue-500">db</button>
            </div><div class="w-6/12">
              <button class="text-gray-500 hover:underline  hover:text-blue-500">11点58分</button>
            </div>
            <div class="w-2/12 text-right pr-2" text-right>
              <span href="#" class="text-gray-500 hover:cursor">2 months ago</span>
            </div>
          </div>
          <div class="flex justify-between px-4 py-3 hover:bg-gray-100 border-b ">
            <div class="w-4/12 flex items-center space-x-2 ">
              <svg class="w-3 h-3 fill-current text-blue-400">
                <path
                  d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z">
                </path>
              </svg>
              <button class="hover:underline hover:text-blue-500">db</button>
            </div><div class="w-6/12">
              <button class="text-gray-500 hover:underline  hover:text-blue-500">11点58分</button>
            </div>
            <div class="w-2/12 text-right pr-2" text-right>
              <span href="#" class="text-gray-500 hover:cursor">2 months ago</span>
            </div>
          </div>
          <div class="flex justify-between px-4 py-3 hover:bg-gray-100 border-b ">
            <div class="w-4/12 flex items-center space-x-2 ">
              <svg class="w-3 h-3 fill-current text-blue-400">
                <path
                  d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z">
                </path>
              </svg>
              <button class="hover:underline hover:text-blue-500">db</button>
            </div><div class="w-6/12">
              <button class="text-gray-500 hover:underline  hover:text-blue-500">11点58分</button>
            </div>
            <div class="w-2/12 text-right pr-2" text-right>
              <span href="#" class="text-gray-500 hover:cursor">2 months ago</span>
            </div>
          </div>
          <div class="flex justify-between px-4 py-3 hover:bg-gray-100 border-b ">
            <div class="w-4/12 flex items-center space-x-2 ">
              <svg class="w-3 h-3 fill-current text-blue-400">
                <path
                  d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z">
                </path>
              </svg>
              <button class="hover:underline hover:text-blue-500">db</button>
            </div><div class="w-6/12">
              <button class="text-gray-500 hover:underline  hover:text-blue-500">11点58分</button>
            </div>
            <div class="w-2/12 text-right pr-2" text-right>
              <span href="#" class="text-gray-500 hover:cursor">2 months ago</span>
            </div>
          </div>
          <div class="flex justify-between px-4 py-3 hover:bg-gray-100 border-b ">
            <div class="w-4/12 flex items-center space-x-2 ">
              <svg class="w-3 h-3 fill-current text-blue-400">
                <path
                  d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z">
                </path>
              </svg>
              <button class="hover:underline hover:text-blue-500">db</button>
            </div><div class="w-6/12">
              <button class="text-gray-500 hover:underline  hover:text-blue-500">11点58分</button>
            </div>
            <div class="w-2/12 text-right pr-2" text-right>
              <span href="#" class="text-gray-500 hover:cursor">2 months ago</span>
            </div>
          </div>
          <div class="flex justify-between px-4 py-3 hover:bg-gray-100 border-b ">
            <div class="w-4/12 flex items-center space-x-2 ">
              <svg class="w-3 h-3 fill-current text-blue-400">
                <path
                  d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z">
                </path>
              </svg>
              <button class="hover:underline hover:text-blue-500">db</button>
            </div>
            <div class="w-6/12">
              <button class="text-gray-500 hover:underline  hover:text-blue-500">11点58分</button>
            </div>
            <div class="w-2/12 text-right pr-2" text-right>
              <span href="#" class="text-gray-500 hover:cursor">2 months ago</span>
            </div>
          </div>
          <div class="flex justify-between px-4 py-3 hover:bg-gray-100 border-b ">
            <div class="w-4/12 flex items-center space-x-2 ">
              <svg class="w-3 h-3 fill-current text-blue-400">
                <path
                  d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z">
                </path>
              </svg>
              <button class="hover:underline hover:text-blue-500">db</button>
            </div>
            <div class="w-6/12">
              <button class="text-gray-500 hover:underline  hover:text-blue-500">11点58分</button>
            </div>
            <div class="w-2/12 text-right pr-2" text-right>
              <span href="#" class="text-gray-500 hover:cursor">2 months ago</span>
            </div>
          </div>
          <div class="flex justify-between px-4 py-3 hover:bg-gray-100 border-b ">
            <div class="w-4/12 flex items-center space-x-2 ">
              <svg class="w-3 h-3 fill-current text-blue-400">
                <path
                  d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z">
                </path>
              </svg>
              <button class="hover:underline hover:text-blue-500">db</button>
            </div>
            <div class="w-6/12">
              <button class="text-gray-500 hover:underline  hover:text-blue-500">11点58分</button>
            </div>
            <div class="w-2/12 text-right pr-2" text-right>
              <span href="#" class="text-gray-500 hover:cursor">2 months ago</span>
            </div>
          </div>
          <div class="flex justify-between px-4 py-3 hover:bg-gray-100 border-b ">
            <div class="w-4/12 flex items-center space-x-2 ">
              <svg class="w-3 h-3 fill-current text-blue-400">
                <path
                  d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z">
                </path>
              </svg>
              <button class="hover:underline hover:text-blue-500">db</button>
            </div>
            <div class="w-6/12 truncate ">
              <a class="text-gray-500 hover:underline hover:cursor-pointer truncate hover:text-blue-500">11点58分 11点58分
                11点58分 11点58分 11点58分 11点58分 11点58分 11点58分 11点58分</a>
            </div>
            <div class="w-2/12 text-right pr-2">
              <span href="#" class="text-gray-500 hover:cursor">2 months ago</span>
            </div>
          </div>
        </div><!-- end file-explore -->

      </div><!-- end file explorer -->
      <div class="sidebar w-1/4 ml-6 space-y-4">
        <div class="about ">
          <div class="top flex items-center justify-between">
            <div class="text-lg ">About</div>
            <svg class="w-5 h-5 fill-current hover:text-blue-500 hover:cursor-pointer">
              <path
                d="M8 0a8.2 8.2 0 0 1 .701.031C9.444.095 9.99.645 10.16 1.29l.288 1.107c.018.066.079.158.212.224.231.114.454.243.668.386.123.082.233.09.299.071l1.103-.303c.644-.176 1.392.021 1.82.63.27.385.506.792.704 1.218.315.675.111 1.422-.364 1.891l-.814.806c-.049.048-.098.147-.088.294.016.257.016.515 0 .772-.01.147.038.246.088.294l.814.806c.475.469.679 1.216.364 1.891a7.977 7.977 0 0 1-.704 1.217c-.428.61-1.176.807-1.82.63l-1.102-.302c-.067-.019-.177-.011-.3.071a5.909 5.909 0 0 1-.668.386c-.133.066-.194.158-.211.224l-.29 1.106c-.168.646-.715 1.196-1.458 1.26a8.006 8.006 0 0 1-1.402 0c-.743-.064-1.289-.614-1.458-1.26l-.289-1.106c-.018-.066-.079-.158-.212-.224a5.738 5.738 0 0 1-.668-.386c-.123-.082-.233-.09-.299-.071l-1.103.303c-.644.176-1.392-.021-1.82-.63a8.12 8.12 0 0 1-.704-1.218c-.315-.675-.111-1.422.363-1.891l.815-.806c.05-.048.098-.147.088-.294a6.214 6.214 0 0 1 0-.772c.01-.147-.038-.246-.088-.294l-.815-.806C.635 6.045.431 5.298.746 4.623a7.92 7.92 0 0 1 .704-1.217c.428-.61 1.176-.807 1.82-.63l1.102.302c.067.019.177.011.3-.071.214-.143.437-.272.668-.386.133-.066.194-.158.211-.224l.29-1.106C6.009.645 6.556.095 7.299.03 7.53.01 7.764 0 8 0Zm-.571 1.525c-.036.003-.108.036-.137.146l-.289 1.105c-.147.561-.549.967-.998 1.189-.173.086-.34.183-.5.29-.417.278-.97.423-1.529.27l-1.103-.303c-.109-.03-.175.016-.195.045-.22.312-.412.644-.573.99-.014.031-.021.11.059.19l.815.806c.411.406.562.957.53 1.456a4.709 4.709 0 0 0 0 .582c.032.499-.119 1.05-.53 1.456l-.815.806c-.081.08-.073.159-.059.19.162.346.353.677.573.989.02.03.085.076.195.046l1.102-.303c.56-.153 1.113-.008 1.53.27.161.107.328.204.501.29.447.222.85.629.997 1.189l.289 1.105c.029.109.101.143.137.146a6.6 6.6 0 0 0 1.142 0c.036-.003.108-.036.137-.146l.289-1.105c.147-.561.549-.967.998-1.189.173-.086.34-.183.5-.29.417-.278.97-.423 1.529-.27l1.103.303c.109.029.175-.016.195-.045.22-.313.411-.644.573-.99.014-.031.021-.11-.059-.19l-.815-.806c-.411-.406-.562-.957-.53-1.456a4.709 4.709 0 0 0 0-.582c-.032-.499.119-1.05.53-1.456l.815-.806c.081-.08.073-.159.059-.19a6.464 6.464 0 0 0-.573-.989c-.02-.03-.085-.076-.195-.046l-1.102.303c-.56.153-1.113.008-1.53-.27a4.44 4.44 0 0 0-.501-.29c-.447-.222-.85-.629-.997-1.189l-.289-1.105c-.029-.11-.101-.143-.137-.146a6.6 6.6 0 0 0-1.142 0ZM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM9.5 8a1.5 1.5 0 1 0-3.001.001A1.5 1.5 0 0 0 9.5 8Z">
              </path>
            </svg>
          </div>
          <div class="bottom space-y-5">
            <div class="text-gray-500 italic mt-3">No description, website, or topics provided.</div>
            <div class="flex items-center space-x-3 text-gray-700 hover:cursor-pointer hover:text-blue-500">
              <svg class="w-4 h-4 fill-current">
                <path
                  d="M6 2c.306 0 .582.187.696.471L10 10.731l1.304-3.26A.751.751 0 0 1 12 7h3.25a.75.75 0 0 1 0 1.5h-2.742l-1.812 4.528a.751.751 0 0 1-1.392 0L6 4.77 4.696 8.03A.75.75 0 0 1 4 8.5H.75a.75.75 0 0 1 0-1.5h2.742l1.812-4.529A.751.751 0 0 1 6 2Z">
                </path>
              </svg>
              <span>Activity</span>
            </div>
            <div class="flex items-center space-x-3 text-gray-700 hover:cursor-pointer hover:text-blue-500">
              <svg class="w-4 h-4 fill-current">
                <path
                  d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Zm0 2.445L6.615 5.5a.75.75 0 0 1-.564.41l-3.097.45 2.24 2.184a.75.75 0 0 1 .216.664l-.528 3.084 2.769-1.456a.75.75 0 0 1 .698 0l2.77 1.456-.53-3.084a.75.75 0 0 1 .216-.664l2.24-2.183-3.096-.45a.75.75 0 0 1-.564-.41L8 2.694Z">
                </path>
              </svg>
              <span><span class="font-semibold ">521</span> starts</span>
            </div>
            <div class="flex items-center space-x-3 text-gray-700 hover:cursor-pointer hover:text-blue-500">
              <svg class="w-4 h-4 fill-current">
                <path
                  d="M8 2c1.981 0 3.671.992 4.933 2.078 1.27 1.091 2.187 2.345 2.637 3.023a1.62 1.62 0 0 1 0 1.798c-.45.678-1.367 1.932-2.637 3.023C11.67 13.008 9.981 14 8 14c-1.981 0-3.671-.992-4.933-2.078C1.797 10.83.88 9.576.43 8.898a1.62 1.62 0 0 1 0-1.798c.45-.677 1.367-1.931 2.637-3.022C4.33 2.992 6.019 2 8 2ZM1.679 7.932a.12.12 0 0 0 0 .136c.411.622 1.241 1.75 2.366 2.717C5.176 11.758 6.527 12.5 8 12.5c1.473 0 2.825-.742 3.955-1.715 1.124-.967 1.954-2.096 2.366-2.717a.12.12 0 0 0 0-.136c-.412-.621-1.242-1.75-2.366-2.717C10.824 4.242 9.473 3.5 8 3.5c-1.473 0-2.825.742-3.955 1.715-1.124.967-1.954 2.096-2.366 2.717ZM8 10a2 2 0 1 1-.001-3.999A2 2 0 0 1 8 10Z">
                </path>
              </svg>
              <span><span class="font-semibold ">999</span> watching</span>
            </div>
            <div class=" flex items-center space-x-3 text-gray-700 hover:cursor-pointer hover:text-blue-500">
              <svg class="w-4 h-4 fill-current">
                <path
                  d="M5 5.372v.878c0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75v-.878a2.25 2.25 0 1 1 1.5 0v.878a2.25 2.25 0 0 1-2.25 2.25h-1.5v2.128a2.251 2.251 0 1 1-1.5 0V8.5h-1.5A2.25 2.25 0 0 1 3.5 6.25v-.878a2.25 2.25 0 1 1 1.5 0ZM5 3.25a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Zm6.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm-3 8.75a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Z">
                </path>
              </svg>
              <span><span class="font-semibold ">2233</span> forks</span>
            </div>
          </div>
        </div><!-- end about -->
        <div class=" h-[1px] bg-gray-300 mt-5"></div>
        <div class="releases">
          <a class="text-lg hover:text-blue-600  hover:cursor-pointer">Releases</a>
          <div class="text-gray-500 mt-5">No releases published</div>
          <a class="text-blue-500 hover:cursor-pointer underline underline-offset-2">Create a new release</a>
        </div><!-- end releases -->
        <div class=" h-[1px] bg-gray-300 mt-5"></div>
        <div class="packages">
          <a class="text-lg hover:text-blue-600  hover:cursor-pointer">Packages</a>
          <div class="text-gray-500 mt-5"> No packages published</div>
          <a class="text-blue-500 hover:cursor-pointer underline underline-offset-2">Publish your first package</a>
        </div><!-- end packages -->
        <div class=" h-[1px] bg-gray-300 mt-5"></div>
        <div class="languages">
          <a class="text-lg hover:text-blue-600  hover:cursor-pointer">Languages</a>
          <div class="bg-yellow-300 rounded w-auto h-2 mt-4"></div>
          <div class="flex mt-6 items-center  space-x-3">
            <div class="bg-yellow-300 rounded w-2 h-2 "></div>
            <div>JavaScript <span class="text-gray-700 font-extralight">100.0%</span></div>
          </div>
        </div><!-- end languages -->
        <div class=" h-[1px] bg-gray-300 mt-5 "></div>
      </div><!-- end sidebar -->
    </div>
  </div>

</body>

</html>